<template>
<div>
  <div v-if="type">
    <el-button type="danger" style="float:right;" @click="getuser">未激活用户</el-button>
    <el-button type="success" style="float:right;" @click="get_user">已激活用户</el-button>
    <div v-if="!is_active">
      <el-table
      :data="userlist"
      border
      style="width: 100%">
      <el-table-column
        fixed
        prop="username"
        label="用户名"
        width="200">
      </el-table-column>
      <el-table-column
        prop="email"
        label="邮箱"
        width="200">
      </el-table-column>
      <el-table-column
        prop="phone"
        label="手机号"
        width="200">
      </el-table-column>
      <el-table-column
        prop="name"
        label="权限"
        width="200">
      </el-table-column>
      <el-table-column
        prop="create_time"
        label="创建时间"
        width="300">
      </el-table-column>
      <el-table-column
        prop="is_active"
        label="是否激活"
        width="200">
      </el-table-column>
      <el-table-column
        fixed="right"
        label="操作"
        width="300">
        <template slot-scope="scope">
          <el-button @click="active(scope.$index, scope.row)" type="text" size="small">激活</el-button>
          <el-button @click="update_type(scope.$index, scope.row)" type="text" size="small">分配权限</el-button>
        </template>
      </el-table-column>
      </el-table>
    </div>
    <div v-if="is_active">
      <el-table
      :data="userlist"
      border
      style="width: 100%">
      <el-table-column
        fixed
        prop="username"
        label="用户名"
        width="200">
      </el-table-column>
      <el-table-column
        prop="email"
        label="邮箱"
        width="200">
      </el-table-column>
      <el-table-column
        prop="phone"
        label="手机号"
        width="200">
      </el-table-column>
      <el-table-column
        prop="name"
        label="权限"
        width="200">
      </el-table-column>
      <el-table-column
        prop="create_time"
        label="创建时间"
        width="300">
      </el-table-column>
      <el-table-column
        prop="is_active"
        label="是否激活"
        width="200">
      </el-table-column>
      <el-table-column
        fixed="right"
        label="操作"
        width="200">
        <template slot-scope="scope">
          <el-button @click="update_type(scope.$index, scope.row)" type="text" size="small">权限修改</el-button>
          <el-button @click="user_delete(scope.$index, scope.row)" type="text" size="small">存档</el-button>
        </template>
      </el-table-column>
      </el-table>
    </div>
   
    <el-dialog title="标签信息修改" :visible.sync="dialogFormVisible">
      <el-form :model="form">
      <el-form-item label="权限列表" :label-width="formLabelWidth">
        <el-select v-model="form.region" placeholder="请选择用户权限">
          <el-option label="收货" value="4"></el-option>
          <el-option label="发货" value="2"></el-option>
          <el-option label="收货+发货" value="3"></el-option>
        </el-select>
      </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="update_type1()">确 定</el-button>
      </div>
    </el-dialog>
  </div>
  <div v-if="!type">
    <el-table
          :data="userlist"
          border
          style="width: 100%">
          <el-table-column
            fixed
            prop="username"
            label="用户名"
            width="200">
          </el-table-column>
          <el-table-column
            prop="email"
            label="邮箱"
            width="200">
          </el-table-column>
          <el-table-column
            prop="phone"
            label="手机号"
            width="200">
          </el-table-column>
          <el-table-column
            prop="name"
            label="权限"
            width="200">
          </el-table-column>
          <el-table-column
            prop="create_time"
            label="创建时间"
            width="400">
          </el-table-column>
          <el-table-column
            prop="is_active"
            label="是否激活"
            width="200">
          </el-table-column>
          </el-table>
  </div>
</div>
  
</template>

<script>
import {userinfo,user_info,active_user,delete_user,type_update,we_info} from '../../api/api.js'

  export default {
    methods: {
      handleClick(row) {
        console.log(row);
      }
    },

    data() {
      return {
        userlist: [],
        is_active:1,
        dialogFormVisible: false,
        form: {
          region: '',
        },
        formLabelWidth: '100px',
        updatename:'',
        type_id:localStorage.getItem('type_id'),
        type:''
      }
    },
    mounted:function(){
      if (this.type_id==1) {
        console.log(this.type_id)
        this.getuser()
        this.type ='是'
      }else{
        console.log(this.type_id)
        this.get_weinfo()
        this.type = ''
      } 
    },
    methods: {
        getuser(){
            var params = {
               uid:localStorage.getItem('uid')
            };
            userinfo(params).then(res=>{
              console.log(res)
                this.userlist=res
                this.is_active=0
            })
        },
        get_user(){
            var params = {
               uid:localStorage.getItem('uid')
            };
            user_info(params).then(res=>{
              console.log(res)
                this.userlist=res
                this.is_active=1
            })
        },
        active(index, row) {
          console.log(row.username);
          var params = {
               username:row.username
            };
            active_user(params).then(res=>{
              this.$message(res.message)
              this.$router.go(0);
            })
        },
        user_delete(index, row){
           var params = {
               username:row.username
            };
            delete_user(params).then(res=>{
              this.$message(res.message)
              this.$router.go(0);
            })
        },
        update_type(index,row){
          this.username = row.username
          this.dialogFormVisible=true;
        },
        update_type1(){

          var params = {
              username : this.username,
              type_id : this.form.region
          };
          type_update(params).then(res=>{
            console.log(res.message)
            //关闭弹窗
            this.dialogFormVisible=false;
            this.$router.go(0);
          })
          
        },
        get_weinfo(){
           var params = {
               uid:localStorage.getItem('uid')
            };
            we_info(params).then(res=>{
              console.log(res)
                this.userlist=res
            })
        }
      }
  }
</script>